<template>
  <el-dialog :title="'机构配置'" :close-on-click-modal="false" :visible.sync="visible" width="850px" @close="clearDataList()">
    <div style="margin: 0 0 10px 0;">
      <el-link icon="el-icon-plus" type="primary"  @click="openSelectFz" :underline="false">选择机构</el-link>
    </div>
    <el-form :model="dataForm" ref="dataForm" @keyup.enter.native="dataFormSubmit()" label-width="125px">
      <el-form-item
        v-for="(item, index) in dataForm.jgList"
        :label="item.fzName"
        :key="index"
        :prop="'jgList['+index+'].gsId'"
        :rules="{
        required: true, message: '请选择', trigger: 'blur'
        }"
      >
        <el-select v-model="dataForm.jgList[index].gsId" placeholder="请选择" clearable @change="elGsChange(index)">
          <el-option v-for="(item1,index) in gsOptions " :key="index" :label="item1.label" :value="item1.value">
          </el-option>
        </el-select>
        &nbsp;<el-input-number v-model="item.jjJe" :precision="2" :step="1" :min="0" style="width:200px;"></el-input-number>
        &nbsp;<el-button @click.prevent="removeDomain(index)" type="danger" plain>删除</el-button>
      </el-form-item>
    </el-form>
    <span slot="footer" class="dialog-footer">
      <el-button type="primary" @click="dataFormSubmit()" v-if="canSubmit">确定</el-button>
      <el-button @click="clearDataList" type="primary" plain>取消</el-button>
    </span>
    <!--选择机构分组-->
    <Jgfzsz v-if="jgfzszVisible" ref="jgfzsz" @getChildValue="setJgfzStr"></Jgfzsz>
  </el-dialog>
</template>

<script>
import {getJiangJinBm} from '@/api/admin/dept'
import {getJgfzList} from '@/api/jiangjin/jiangjinjjjgfz'
import {getJjDeptJjgtoPrant} from '@/api/admin/sysformula'
import Jgfzsz from './jiangjinjgpzfz'

export default {
  components:{
    Jgfzsz
  },
  mounted() {
    this.getJiangJinJg();
  },
  data() {
    return {
      visible: false,
      canSubmit: false,
      jgfzszVisible: false,
      deptId: '',
      deptName: '',
      fzId: '',

      gsData: [], //公式List
      gsOptions: [],
      dataForm: {
        jgList: []
      }
    }
  },
  methods: {
    init() {
      this.visible = true;
      this.canSubmit = true;
    },
    getSelectJg(){
      let lResult = [];
      this.dataForm.jgList.map(item =>{
        lResult.push(item.fzId);
      })
      return lResult.join(',') ;
    },
    openSelectFz(){
      this.jgfzszVisible = true
      this.$nextTick(() => {
        this.$refs.jgfzsz.init(this.deptId,this.getSelectJg());
      })
    },

    elGsChange(index) {
      let lResult = '';

      this.gsOptions.find((item) => {
        if (item.value === this.dataForm.jgList[index].gsId) {
          lResult = item.label;
        }
      })
      this.$set(this.dataForm.jgList[index],"gsName",lResult);
    },
    //设置
    setJgfzStr(obj){
      ////console.log(obj);
      obj.map(item =>{
        this.dataForm.jgList.push({
          fzId: item.id,
          fzName: item.jgFzName,
          gsId: null,
          gsName: "",
          jjJe: 0
        })
      })
    },

    removeDomain(index) {
      this.dataForm.jgList.splice(index, 1);
      this.fzId = "";
    },

    //设置公式option
    setGsOptiions() {
      this.gsData.map(item => {
        this.gsOptions.push({
          value: item.id,
          label: item.gsMc
        })
      })
    },

    //取得公式数组
    getGsListOption() {
      getJjDeptJjgtoPrant({id: this.deptId,gsType:'奖金算法',gsFl:'部门'}).then(res => {
        this.gsData = res.data.data;
        ////console.log(this.gsData);
        this.setGsOptiions();
      })
    },
    //获取奖金管理人机构
    getJiangJinJg() {
      getJiangJinBm().then(res => {
        if (res.data.data != null && res.data.data.length > 0) {
          this.deptId = res.data.data[0].deptId;
          this.deptName = res.data.data[0].name;
          this.refresh();
          this.getGsListOption();
        } else {
          this.$notify.closeAll();
          //this.$notify.error("没有相关负责部门")
          //this.deptName = "无相关负责部门";
        }
      });
    },
    refresh() {

      this.gsData = [];
      this.gsOptions = [];
      this.dataForm.jgList = [];
    },
    clearDataList(){
      this.dataForm.jgList = [];
      this.fzId = "";
      this.visible =false;
    },
    dataFormSubmit() {
      this.$refs['dataForm'].validate((valid) => {
        if (valid) {
          let sqlData = [];
          sqlData = this.dataForm.jgList;
         //console.log(sqlData);
        }
      })
    }
  }
}
</script>

<style scoped>

</style>
